<!DOCTYPE html>

<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>Documentation Index</title>

	<!--[if lt IE 9]>
	<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->
	<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">

	<link type="text/css" rel="stylesheet" href="styles/site.simplex.css">

</head>

<body>

<div class="navbar navbar-default navbar-fixed-top ">
<div class="container">
	<div class="navbar-header">
		<a class="navbar-brand" href="index.html">Documentation</a>
		<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#topNavigation">
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
        </button>
	</div>
	<div class="navbar-collapse collapse" id="topNavigation">
		<ul class="nav navbar-nav">
			
			<li class="dropdown">
				<a href="namespaces.list.html" class="dropdown-toggle" data-toggle="dropdown">Namespaces<b class="caret"></b></a>
				<ul class="dropdown-menu ">
					<li><a href="openBSE.html">openBSE</a></li>
				</ul>
			</li>
			
			<li class="dropdown">
				<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b class="caret"></b></a>
				<ul class="dropdown-menu ">
					<li><a href="openBSE.BrowserNotSupportError.html">openBSE.BrowserNotSupportError</a></li><li><a href="openBSE.BulletScreenEngine.html">openBSE.BulletScreenEngine</a></li><li><a href="openBSE.Contextmenu.html">openBSE.Contextmenu</a></li>
				</ul>
			</li>
			
			<li class="dropdown">
				<a href="events.list.html" class="dropdown-toggle" data-toggle="dropdown">Events<b class="caret"></b></a>
				<ul class="dropdown-menu ">
					<li><a href="openBSE.BulletScreenEngine.html#event:click">openBSE.BulletScreenEngine#event:click</a></li><li><a href="openBSE.BulletScreenEngine.html#event:contextmenu">openBSE.BulletScreenEngine#event:contextmenu</a></li><li><a href="openBSE.BulletScreenEngine.html#event:mouseenter">openBSE.BulletScreenEngine#event:mouseenter</a></li><li><a href="openBSE.BulletScreenEngine.html#event:mouseleave">openBSE.BulletScreenEngine#event:mouseleave</a></li>
				</ul>
			</li>
			
		</ul>
        
            <div class="col-sm-3 col-md-3">
                <form class="navbar-form" role="search">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search" name="q" id="search-input">
                        <div class="input-group-btn">
                            <button class="btn btn-default" id="search-submit"><i class="glyphicon glyphicon-search"></i></button>
                        </div>
                    </div>
                </form>
            </div>
        
	</div>

</div>
</div>


<div class="container" id="toc-content">
<div class="row">

	
	<div class="col-md-8">
	
		<div id="main">
			

	
	











	
	





    <section class="readme-section">
        <article><h1>openBSE Documentation</h1><p><a href="https://github.com/iamscottxu/openBSE/releases/tag/v2.0"><img src="https://img.shields.io/badge/version-2.0-brightgreen.svg?style=flat-square" alt="Version 2.0"></a>
<a href="https://www.npmjs.com/package/openbse"><img src="https://img.shields.io/npm/v/openbse.svg?style=flat-square" alt="NPM"></a>
<a href="https://github.com/iamscottxu/openBSE/blob/master/LICENSE"><img src="https://img.shields.io/github/license/mashape/apistatus.svg?style=flat-square" alt="MIT"></a></p>
<p><a href="https://github.com/iamscottxu/openBSE/wiki">wiki</a> |
<a href="https://iamscottxu.github.io/openBSE/demo/openBSEDemo.html">Demo</a></p>
<p><strong>欢迎来到 openBSE 文档！</strong></p>
<p>openBSE 是一个一个高性能 JavaScript 弹幕引擎，简单易用。支持 CSS3 、 Canvas 2D 、 WebGL 和 SVG 渲染方式。支持顶部、底部、逆向弹幕渲染。使用 Canvas 2D 渲染方式可同屏渲染至少1000条弹幕（可达1600条，与电脑配置有关）。</p>
<h2>安装和使用</h2><h3>安装</h3><p>你可以直接点击<a href="https://github.com/iamscottxu/openBSE/releases/tag/v2.0">这里</a>下载最新发行版本，也可以用以下命令安装NPM包。</p>
<pre class="prettyprint source lang-Bash"><code>> npm install openbse</code></pre><h3>使用</h3><p>安装完成后，在 Html 页面引入。</p>
<p>压缩版：</p>
<pre class="prettyprint source lang-Html"><code>&lt;script src=&quot;openBSE.all.min.js&quot;>&lt;/script></code></pre><p>调试版：</p>
<pre class="prettyprint source lang-Html"><code>&lt;script src=&quot;openBSE.all.js&quot;>&lt;/script></code></pre><p>添加一个 id 为 <code>BulletScreensDiv</code> 的固定大小的 div 标签用于显示弹幕，并插入以下 JavaScript 代码。</p>
<pre class="prettyprint source lang-JavaScript"><code>var bulletScreenEngine = new openBSE.BulletScreenEngine(document.getElementById('BulletScreensDiv'));
var _startTime = 5000;
for (var i = 0; i &lt; 10000; i++) {
    bulletScreenEngine.addBulletScreen({
        text: &quot;这是一个长长长长长长长长长长长长长长长长长长长长长长长长的测试(^_^)&quot;,
        startTime: _startTime
    });
    _startTime += Math.round(Math.random() * 300);
}
bulletScreenEngine.play();</code></pre><p>用浏览器打开网页即可显示弹幕。</p>
<p>详细使用说明请查看 <a href="https://github.com/iamscottxu/openBSE/wiki">wiki</a> 。</p>
<h2>联系作者</h2><p>如果有任何问题请写下 <a href="https://github.com/iamscottxu/openBSE/issues">issues</a> 。<br/>
E-mail：<a href="mailto:scottxu@scottxublog.com">scottxu@scottxublog.com</a></p>
<h2>版权声明</h2><p>这个项目是一个开源项目，遵循 MIT 开源协议。要查看协议，请点击<a href="https://github.com/iamscottxu/openBSE/blob/master/LICENSE">这里</a>。</p></article>
    </section>







		</div>
	</div>

	<div class="clearfix"></div>

	
		<div class="col-md-3">
			<div id="toc" class="col-md-3 hidden-xs hidden-sm hidden-md"></div>
		</div>
	

</div>
</div>


    <div class="modal fade" id="searchResults">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">Search results</h4>
          </div>
          <div class="modal-body"></div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div>


<footer>


<span class="jsdoc-message">
	Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a>
	
		on 2019-03-05T09:19:22+08:00
	
	using the <a href="https://github.com/docstrap/docstrap">DocStrap template</a>.
</span>
</footer>

<script src="scripts/docstrap.lib.js"></script>
<script src="scripts/toc.js"></script>

    <script type="text/javascript" src="scripts/fulltext-search-ui.js"></script>


<script>
$( function () {
	$( "[id*='$']" ).each( function () {
		var $this = $( this );

		$this.attr( "id", $this.attr( "id" ).replace( "$", "__" ) );
	} );

	$( ".tutorial-section pre, .readme-section pre, pre.prettyprint.source" ).each( function () {
		var $this = $( this );

		var example = $this.find( "code" );
		exampleText = example.html();
		var lang = /{@lang (.*?)}/.exec( exampleText );
		if ( lang && lang[1] ) {
			exampleText = exampleText.replace( lang[0], "" );
			example.html( exampleText );
			lang = lang[1];
		} else {
			var langClassMatch = example.parent()[0].className.match(/lang\-(\S+)/);
			lang = langClassMatch ? langClassMatch[1] : "javascript";
		}

		if ( lang ) {

			$this
			.addClass( "sunlight-highlight-" + lang )
			.addClass( "linenums" )
			.html( example.html() );

		}
	} );

	Sunlight.highlightAll( {
		lineNumbers : false,
		showMenu : true,
		enableDoclinks : true
	} );

	$.catchAnchorLinks( {
        navbarOffset: 10
	} );
	$( "#toc" ).toc( {
		anchorName  : function ( i, heading, prefix ) {
			return $( heading ).attr( "id" ) || ( prefix + i );
		},
		selectors   : "#toc-content h1,#toc-content h2,#toc-content h3,#toc-content h4",
		showAndHide : false,
		smoothScrolling: true
	} );

	$( "#main span[id^='toc']" ).addClass( "toc-shim" );
	$( '.dropdown-toggle' ).dropdown();

    $( "table" ).each( function () {
      var $this = $( this );
      $this.addClass('table');
    } );

} );
</script>



<!--Navigation and Symbol Display-->


<!--Google Analytics-->



    <script type="text/javascript">
        $(document).ready(function() {
            SearcherDisplay.init();
        });
    </script>


</body>
</html>